import Vue from 'vue'
import VueRouter from 'vue-router'
import Login from '@/views/login/index'
import ErrorPage from '@/views/error-page/index'
import store from '@/store'

Vue.use(VueRouter)

const routes = [
  {
    path: '/login',
    name: 'login',
    component: Login,
  },
  {
    path: '/',
    component: () => import(/* webpackChunkName: "layout" */ '@/views/layout/index'),
    meta: { requiresAuth: true },
    children: [
      {
        path: '',
        name: 'home',
        component: () => import(/* webpackChunkName: "home" */ '@/views/home/index'),
      }, {
        path: '/role',
        name: 'role',
        component: () => import(/* webpackChunkName: "role" */ '@/views/role/index'),
      }, {
        path: '/role/:roleId/alloc-menu',
        name: 'alloc-menu',
        props: true,
        component: () => import(/* webpackChunkName: "alloc-menu" */ '@/views/role/alloc-menu'),
      }, {
        path: '/role/:roleId/alloc-resource',
        name: 'alloc-resource',
        props: true,
        component: () => import(/* webpackChunkName: "alloc-resource" */ '@/views/role/alloc-resource'),
      }, {
        path: '/menu',
        name: 'menu',
        component: () => import(/* webpackChunkName: "menu" */ '@/views/menu/index'),
      }, {
        path: '/menu/create',
        name: 'create-menu',
        component: () => import(/* webpackChunkName: "create-menu" */ '@/views/menu/create'),
      }, {
        path: '/menu/:id/edit',
        name: 'edit-menu',
        component: () => import(/* webpackChunkName: "edit-menu" */ '@/views/menu/edit'),
        props: true,
      }, {
        path: '/resource',
        name: 'resource',
        component: () => import(/* webpackChunkName: "resource" */ '@/views/resource/index'),
      }, {
        path: '/course',
        name: 'course',
        component: () => import(/* webpackChunkName: "course" */ '@/views/course/index'),
      }, {
        path: '/course/create',
        name: 'create-course',
        component: () => import(/* webpackChunkName: "create-course" */ '@/views/course/create'),
      }, {
        path: '/course/:courseId/edit',
        name: 'edit-course',
        component: () => import(/* webpackChunkName: "edit-course" */ '@/views/course/edit'),
        props: true,
      }, {
        path: '/course/:courseId/sections',
        name: 'course-section',
        component: () => import(/* webpackChunkName: "course-section" */ '@/views/course/section'),
        props: true,
      }, {
        path: '/course/:courseId/lesson/:lessonId/video',
        name: 'course-video',
        component: () => import(/* webpackChunkName: "course-video" */ '@/views/course/video'),
        props: true,
      }, {
        path: '/course/upload-auth',
        name: 'course-uploadAuth',
        component: () => import(/* webpackChunkName: "course-uploadAuth" */ '@/views/course/UploadAuth'),
        props: true,
      }, {
        path: '/user',
        name: 'user',
        component: () => import(/* webpackChunkName: "user" */ '@/views/user/index'),
      }, {
        path: '/advert',
        name: 'advert',
        component: () => import(/* webpackChunkName: "advert" */ '@/views/advert/index'),
      }, {
        path: '/advert-space',
        name: 'advert-space',
        component: () => import(/* webpackChunkName: "advert-space" */ '@/views/advert-space/index'),
      },
    ]
  },
  {
    path: '*',
    name: 'error-page',
    component: ErrorPage,
  }
]

const router = new VueRouter({
  routes
})

// 路由前置守卫：进入页面前判断当前用户是否有权限
router.beforeEach((to, from, next) => {
  if (to.matched.some(record => record.meta.requiresAuth) && !store.state.user) {
    next({
      name: 'login',
      query: {
        redirect: to.fullPath
      }
    })
  } else {
    next()
  }
})

export default router
